<template>
	<view class='sharing-packets' :style="{ top: top + '%'}"
	:class="sharePacket.touchstart?'hide_left':'' "
	 @touchmove.stop.prevent="setTouchMove" >
	    <view class='sharing-con' :style="'background-image:url('+ icon +');' + iconSize">
	        <view class='text' >
				<view class='shareBut'>添加</view>
			</view>
	    </view>  
	</view>
</template>
<!--  -->
<script>
	// import { getImageDomain } from '@/api/api.js'
	export default {
		props: {
			sharePacket: {
				type: Object,
				default: function(){
					return {isState: true,priceName:'',touchstart:false}
				}
			},
			icon:{
				type: String,
				default: './static/images/addCustomer.png'
			},
			iconSize:{
				type:String,
				default:"width: 100rpx;height: 100rpx;"
			}
			
		},
		data() {
			return {
				top: "85",
			};
		},
		created(){
			let that = this;
		},
		methods: {
			setTouchMove(e) {
				var that = this;
				if (e.touches[0].clientY < 545 && e.touches[0].clientY > 66) {
					that.top = e.touches[0].clientY
				}
			},

		},
	}
</script>

<style scoped lang="scss">
	.sharing-packets{
		position:fixed;left:80%;z-index:99;transition: all .2s linear;
		&.hide_left{
			transition: all .2s linear;left: -110rpx;
			transform: scale(.6);
		}
	}
	.sharing-packets .iconfont{width:44rpx;height:44rpx;border-radius:50%;text-align:center;line-height:44rpx;background-color:#999;font-size:20rpx;color:#fff;margin:0 auto;box-sizing:border-box;padding-left:1px;}
	.sharing-packets .line{width:2rpx;height:40rpx;background-color:#999;margin:0 auto;}
	.sharing-packets .sharing-con{width:187rpx;height:210rpx;position:relative;background-size: cover;}
	.sharing-packets .sharing-con .text{position:absolute;top:30rpx;font-size:20rpx;width:100%;text-align:center;}
	.sharing-packets .sharing-con .text .money{font-size:32rpx;font-weight:bold;margin-top:5rpx;}
	.sharing-packets .sharing-con .text .money .label{font-size:20rpx;}
	.sharing-packets .sharing-con .text .tip{font-size:18rpx;color:#999;margin-top:5rpx;}
	.sharing-packets .sharing-con .text .shareBut{font-size:30rpx;color:#c90e0e;margin-top:50rpx;height:50rpx;line-height:50rpx;}
</style>
